<template>
    <view class="cost-item">
        <view class="left-wrapper">
            <view class="index">{{ index + 1 }}</view>
            <view class="c-name" v-show="type == 2">
                {{ item.BName }}
            </view>
            <view class="c-name" v-show="type == 3">
                {{ item.EName }}
            </view>
            <view class="c-name" v-show="type == 5">
                {{ item.DName }}
            </view>
            <view class="c-name" v-show="type == 7">
                {{ item.PName }}
            </view>
        </view>
        <view class="right-wrapper">
            <view class="c-turnover" @click="goCommodity()">
                <view class="sum">{{ item.Qty }}</view>
            </view>
            <view class="c-turnover sale-money">
                <view class="sum">¥{{ item.Total }}</view>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    components: {},
    props: {
        item: {
            type: Object,
            default: () => {},
        },
        index: {
            type: Number,
            default: 0,
        },
        type: {
            type: String / Number,
            default: 2,
        },
    },
    data() {
        return {}
    },
    mounted() {},
    onShow() {},
    methods: {
		goCommodity(){
			this.easyGoTo("/pages_erpA8/new-sale/commodity-list?type="+this.type+'&code='+this.goCode())
		},
		goCode(){
			if(this.type==2){
				return this.item.BCode
			}
			if(this.type==3){
				return this.item.ECode
			}
			if(this.type==5){
				return this.item.DCode
			}
			if(this.type==7){
				return this.item.PCode
			}
		}
	},
}
</script>

<style lang="scss">
.cost-item {
    display: flex;
    justify-content: space-between;
    border-bottom: #ebebeb solid 1px;
    padding: 32rpx 60rpx 32rpx 0;
    margin-left: 48rpx;
    text-align: center;

    .left-wrapper,
    .right-wrapper {
        display: flex;
        flex: 1;
    }

    .right-wrapper {
        display: flex;
        justify-content: space-between;
        padding-left: 48rpx;
        .sale-money {
            margin-right: 24rpx;
        }
    }

    .c-name {
        flex: 1;
        word-break: break-all;
        text-align: left;
        margin-left: 48rpx;
        font-size: $size-28;
    }
    .c-turnover {
        .sum {
            font-size: $size-28;
        }
        .total {
            font-size: $size-24;
            color: $color-gray-3;
        }
    }
    .c-profit {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 180rpx;
        .perc {
            width: 136rpx;
            height: 46rpx;
            line-height: 46rpx;
            font-size: $size-28;
            background: #fff7eb;
            color: #ef9604;
        }
    }
}
.c-yellow {
    color: $color-yellow-1;
}
</style>
